<div id="detail" class="need">
    <div class="top container-fluid">
        <div class="container">
            <div class="brief">
                <h3 class="tit">
              <small>求租</small>
              <strong>{{ info.title }}</strong>
            </h3>
                <ul class="list-inline do">
                    <!-- <li>编号：<span>3809</span></li> -->
                    <li>已被浏览：<span>{{ info.viewCount }}</span>次</li>
                    <li class="text-right">
                        {{ if userinfo }}
                           {{ if userinfo.pub &&  userinfo.pub.toString().indexOf(info._id.toString()) != -1 }}
                               <span data-pid="{{@ info._id}}"><i class="fa fa-heart"></i>已收藏</span>
                               {{ else }}
                               <span class="follow-message" data-pid="{{@ info._id}}"><i class="fa fa-heart-o"></i>收藏</span>
                           {{ /if }}
                           {{ else }}
                          <a href="/{{site.subDomain}}/signin"><span><i class="fa fa-heart-o"></i>收藏</span></a>

                        {{ /if }}
                    </li>
                </ul>
                <div class="price row">
                    <div class="col-lg-7 col-md-7">
                        <dl class="dl-horizontal">
                            <dt>租金 : </dt>
                            <dd><strong>{{ info.estate.rental.min }}</strong><strong>{{ info.estate.rental.max }}</strong>元/月</dd>
                        </dl>
                    </div>
                    <div class="col-lg-5 col-md-5">
                        <dl class="dl-horizontal">
                            <dt>面积 : </dt>
                            <dd><strong>{{ info.estate.area.min }}</strong><strong>{{ info.estate.area.max }}</strong>m<sup>2</sup></dd>
                        </dl>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-7 col-md-7">
                        <dl class="dl-horizontal">
                            <dt>区域商圈 : </dt>
                            <dd><a href="#">{{ info.estate.district[0] }}</a><a href="#">{{ info.estate.shopArea[0] }}</a><span>{{ info.estate.subway[0] }}</span></dd>
                        </dl>
                    </div>
                    <div class="col-lg-5 col-md-5">
                        <dl class="dl-horizontal">
                            <dt>商铺类型 : </dt>
                            <dd>{{ info.category }}</dd>
                        </dl>
                    </div>
                </div>
                <div class="tel media">
                    <div class="media-left media-middle">
                        <span class="att">网友个人信息</span>
                    </div>
                    <div class="media-body media-middle">
                        <p>
                            {{ if info.contact.gender == 'male' }}
                                {{ info.contact.name }}先生
                                {{ else }}
                                {{ info.contact.name }}女士
                            {{ /if }}
                            <strong>{{ info.contact.phone }}</strong></p>
                        <small>联系我时，请说明是在腾铺网看到的，谢谢！</small>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="review container">
        <h4 class="text-center"><strong>需求简介</strong></h4>
        <div class="con">
            <p>
                {{ info.content }}
            </p>
        </div>
        <div class="tip">
            <strong>免责声明</strong>
            <p>以上商铺信息为网友个人发布，未经平台认证，请自行斟酌本平台不承担任何交易风险和责任。</p>
        </div>
    </div>

    <div class="fav">
      <h4 class="text-center"><strong><i class="fa fa-heart-o"></i>猜你喜欢</strong></h4>
      <div id="choose" class="index-choose container">
        <div class="list row">
          {{ each info.adsenses.Detail data index }}
          <div class="col-lg-4 col-md-4">
             <!-- style="height: 339px;" -->
            <div class="item-store pic">
              <div class="point">优选</div>
              <img src="{{ data.images[0] | watermark}}" alt="">
              <div class="con">
                  <a href="/{{ site.subDomain }}/detail/{{data._id.toString()}}">
                     <div class="tit"><strong>{{ data.title }}</strong></div>
                  </a>
                <dl>
                  <dt>[转让]</dt>
                  <dd>{{ data.estate.district }} {{ data.estate.shopArea }}</dd>
                  <dd><strong>{{ data.estate.area }}</strong>m<sup name="">2</sup></dd>
                  <dd><strong>{{ data.estate.rental }}</strong>元/月</dd>
                </dl>
              </div>
            </div>
            <div class="con">
                {{ each info.adsenses.DetailSm sdata sindex }}
                {{ if sindex == index }}
                  <div class="item-store media">
                    <div class="media-left">
                      <div class="point sm">优选</div>
                      <!-- <div style="width:100px;height:75px;overfllow:hidden;">
                          <img style="width:100%;height:auto;" src="{{ sdata.images[0] | watermark }}" alt="">
                      </div> -->
                      <div>
                          <img src="{{ sdata.images[0] | watermark }}" alt="">
                      </div>
                    </div>
                    <div class="media-body">
                        <a href="/{{ site.subDomain }}/detail/{{sdata._id.toString()}}">
                           <h4 class="media-heading"><strong>{{ sdata.title }}</strong></h4>
                        </a>

                      <p>
                        <strong>[转让]</strong>
                        <span>{{ sdata.estate.district }} {{ sdata.estate.shopArea }}</span>
                        <span>{{ sdata.estate.type }}</span>
                      </p>
                      <p>
                        <span><strong>{{ sdata.estate.area }}</strong>m<sup name="">2</sup></span>
                        <span><strong>{{ sdata.estate.rental }}</strong>元/月</span>
                      </p>
                    </div>
                  </div>
              {{ /if }}
              {{ /each }}
            </div>
          </div>
          {{ /each}}

        </div>
      </div>
    </div>

    <!-- BigPic -->
    <div class="modal fade" id="myPic" tabindex="-1" role="dialog" aria-labelledby="myPicLabel" aria-hidden="true">
      <div class="modal-dialog">
          <div class="modal-body">
            <div id="big-pic" class="carousel slide" data-ride="carousel">
              <!-- Wrapper for slides -->
              <div class="carousel-inner big-detail-img" role="listbox">
                  {{ each info.images data index }}
                  {{ if index == 0}}
                  <div class="item active center-block">
                    <img src="{{ data | watermark}}" alt="...">
                  </div>
                  {{ else }}
                  <div class="item center-block">
                    <img src="{{ data | watermark}}" alt="...">
                  </div>
                  {{ /if }}
                  {{ /each}}
              </div>

              <!-- Controls -->
              <a class="left carousel-control" href="#big-pic" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left fa fa-angle-left"></span>
                <span class="sr-only">Previous</span>
              </a>
              <a class="right carousel-control" href="#big-pic" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right fa fa-angle-right"></span>
                <span class="sr-only">Next</span>
              </a>
            </div>
          </div>
          <div class="modal-footer">
            1/3
          </div>
        </div>
      </div>
</div>
<script>
    var $followMessage = $('.follow-message');
    $followMessage.on('click',function(){
        var self = this;
        followMessage(self);
    });
    function followWatch(self){
        var pid = $(self).data('pid');
        $.ajax({
            type: "put",
            contentType: "application/json",
            url: SITE_ADDR + "/info/"+pid+"/watch",
            success: function (data, textStatus) {
                followMessage(self);
            },
            complete: function (XMLHttpRequest, textStatus) {
                submiting = false;
            }
        });
    }
    function followMessage(self){
        var pid = $(self).data('pid');
        var uid = loginUser._id;
        $.ajax({
            type: "put",
            contentType: "application/json",
            url: SITE_ADDR+"/user/"+pid+"/"+uid+"/collection",
            success: function (data, textStatus) {
                if (data.ok) {
                    $(self).find('i').removeClass('follow-message')
                    $(self).find('i').addClass('fa-heart')
                }
                else {
                    bootbox.alert('抱歉服务器出问题啦');
                }
            },
            complete: function (XMLHttpRequest, textStatus) {
                submiting = false;
            }
        });
    }
</script>
